<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
	<title>Document</title>
	<link href="../css/wap/index.css" rel="stylesheet">
	<link href="../css/base.css" rel="stylesheet">
    <script type="text/javascript" src="../js/jquery-1.9.1.min.js"></script>
</head>
<body>
	<ul class="dock">
		<li class="active"><a href="index.html">课程学习</a></li>
		<li><a href="person-page.html">个人中心</a></li>
		<li><a href="">下载APP</a></li>
	</ul>
	<div class="main">
		<div class="list">
			<h5 class="nav">全部课程</h1>
			<ul class="nav-all inactive">
				<li class="nav-list"><a href="#">分类1</a></li>
				<li class="nav-list"><a href="#">分类2</a></li>
				<li class="nav-list"><a href="#">分类3</a></li>
				<li class="nav-list"><a href="#">分类4</a></li>
				<li class="nav-list"><a href="#">分类5</a></li>
				<li class="nav-list"><a href="#">分类6</a></li>
				<li class="nav-list"><a href="#">分类7</a></li>
				<li class="nav-list"><a href="#">分类8</a></li>
				<li class="nav-list"><a href="#">分类9</a></li>
				<li class="nav-list"><a href="#">分类10</a></li>
				<li class="nav-list"><a href="#">分类11</a></li>
				<li class="nav-list"><a href="#">分类12</a></li>
				<li class="nav-list"><a href="#">分类13</a></li>
				<li class="nav-list"><a href="#">分类14</a></li>
				<li class="nav-list"><a href="#">分类15</a></li>
				<li class="nav-list"><a href="#">分类16</a></li>
			</ul>
		</div>
		<div class="content">
			<ul class="course-list">
				<li class="course-one">
					<a href="wap-play.html">
						<div>
							<div class="thumbnail">
								<img src="../images/1-3.jpg" alt="缩略图"/>
							</div>
							<div class="caption">
								<h3>课程标题sdasdasdasdasdasdasda</h3>
								<p>时长：xx分钟</p>
							</div>
						</div>
					</a>
				</li>
				<li class="course-one">
					<a href="wap-play.html">
						<div>
							<div class="thumbnail">
								<img src="../images/1-3.jpg" alt="缩略图"/>
							</div>
							<div class="caption">
								<h3>课程标题sdasdasdasdasdasdasda</h3>
								<p>时长：xx分钟</p>
							</div>
						</div>
					</a>
				</li>
				<li class="course-one">
					<a href="wap-play.html">
						<div>
							<div class="thumbnail">
								<img src="../images/1-3.jpg" alt="缩略图"/>
							</div>
							<div class="caption">
								<h3>课程标题sdasdasdasdasdasdasda</h3>
								<p>时长：xx分钟</p>
							</div>
						</div>
					</a>
				</li>
				<li class="course-one">
					<a href="wap-play.html">
						<div>
							<div class="thumbnail">
								<img src="../images/1-3.jpg" alt="缩略图"/>
							</div>
							<div class="caption">
								<h3>课程标题sdasdasdasdasdasdasda</h3>
								<p>时长：xx分钟</p>
							</div>
						</div>
					</a>
				</li>
				<li class="course-one">
					<a href="wap-play.html">
						<div>
							<div class="thumbnail">
								<img src="../images/1-3.jpg" alt="缩略图"/>
							</div>
							<div class="caption">
								<h3>课程标题sdasdasdasdasdasdasda</h3>
								<p>时长：xx分钟</p>
							</div>
						</div>
					</a>
				</li>
				<li class="course-one">
					<a href="wap-play.html">
						<div>
							<div class="thumbnail">
								<img src="../images/1-3.jpg" alt="缩略图"/>
							</div>
							<div class="caption">
								<h3>课程标题sdasdasdasdasdasdasda</h3>
								<p>时长：xx分钟</p>
							</div>
						</div>
					</a>
				</li>
				<li class="course-one">
					<a href="wap-play.html">
						<div>
							<div class="thumbnail">
								<img src="../images/1-3.jpg" alt="缩略图"/>
							</div>
							<div class="caption">
								<h3>课程标题sdasdasdasdasdasdasda</h3>
								<p>时长：xx分钟</p>
							</div>
						</div>
					</a>
				</li>
			</ul>
		</div>
	</div>
	<script type="text/javascript">
		$(function(){
			$(".nav").click(function(){
				$(".nav-all").toggle();
				$(".content").toggle();
			});
			$(function(){
				var imgs= $(".thumbnail").find("img");
				var imgW= parseInt(imgs.css("width"));
				imgs.css("height",imgW*0.6+"px");
			});
		});
	</script>
</body>
</html>